<?php
use yii\widgets\ActiveForm;
use yii\helpers\Html;

\app\core\widgets\layer\LayerAsset::register($this);
?>
    <div class="contact-form mt-40">
        <?php $form = ActiveForm::begin([
            'id' => 'send-form',
            'action' => Yii::$app->urlManager->createUrl(['site/send-mail'])
        ]) ?>
        <div class="box-main">
            <h2>联络我们</h2>
            <div class="row">
                <div class="col-xs-12 col-md-4 item">
                    <?= Html::activeTextInput($mailForm, 'name', ['placeholder' => '称谓', 'class' => 'txt']) ?>
                </div>
                <!---->
                <div class="col-xs-12 col-md-4 item">
                    <?= Html::activeTextInput($mailForm, 'email', ['placeholder' => '电子邮件', 'class' => 'txt']) ?>
                </div>
                <!---->
                <div class="col-xs-12 col-md-4 item">
                    <div class="verify">

                        <?= \yii\captcha\Captcha::widget(['name' => 'captchaimg', 'captchaAction' => 'site/captcha', 'imageOptions' => ['id' => 'captchaimg', 'title' => '换一个', 'alt' => '换一个', 'class' => 'img-fluid'], 'template' => '{image}']); ?>
                        <a href="javascript:;" class="btn-refresh" id="captchaimgRefreshBtn"><i
                                    class="fa fa-refresh"></i></a>
                    </div>
                    <div class="con"><?= Html::activeTextInput($mailForm, 'verifyCode', ['placeholder' => '验证码', 'class' => 'txt']) ?></div>
                </div>
                <!---->
                <div class="col-xs-12 item">
                    <?= Html::activeTextInput($mailForm, 'body', ['placeholder' => '留言内容', 'class' => 'txt']) ?>
                </div>
                <!---->
                <div class="col-xs-12 item btn-area">
                    <?= Html::submitInput('提交', ['class' => 'btn']) ?>
                </div>
                <!---->
            </div>
        </div>
        <?php ActiveForm::end() ?>
    </div>
    <!--/contact-form-->
<?php
$jsStr = <<<EOF
    function layerMsg(content) {
        layer.open({
            content: content,
            btn: '我知道了'
        });
    }

    $('#captchaimgRefreshBtn').on('click', function(){
        $('#captchaimg').click();
    });
    
    $('form#send-form').on('beforeSubmit', function(){
        var form = $(this);
        if($.trim($('#contactform-name').val())==''){
            layer.tips('请输入称谓', $('#contactform-name'), {tips: [1, '#ef5c5c'], time: 2000});
            return false;
        }
        if($.trim($('#contactform-email').val())==''){
            layer.tips('请输入电子邮件', $('#contactform-email'), {tips: [1, '#ef5c5c'], time: 2000});
            return false;
        }
        if($.trim($('#contactform-verifycode').val())==''){
            layer.tips('请输入验证码', $('#contactform-verifycode'), {tips: [1, '#ef5c5c'], time: 2000});
            return false;
        }
        if($.trim($('#contactform-body').val())==''){
            layer.tips('请输入留言内容', $('#contactform-body'), {tips: [1, '#ef5c5c'], time: 2000});
            return false;
        }
        $.ajax({
            url: form.attr('action'),
            type: 'post',
            data: form.serialize(),
            beforeSend: function () {
                $(':submit').attr('disabled', true).addClass('disabled');
            },
            complete: function () {
                $(':submit').attr('disabled', false).removeClass('disabled');
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert('请输入正确格式的数据');
                return;
            },
            success: function (data) {
                $(':submit').attr('disabled', false).removeClass('disabled');
                layer.tips(data.msg, $('#contactform-email'), {tips: [1, '#ef5c5c'], time: 2000});
                if(data.state == 1) {
                    form.reset();
                }
            }
        })
    }).on('submit',function(e){
        e.preventDefault();
    });
EOF;

$this->registerJs($jsStr);